<template>
  <div id="app">
    <!-- 引导组件 -->
    <div v-if="IsShow">
      <StartupInterface ref="Interface" @update="toggle"></StartupInterface>
    </div>

    <!-- 导航栏组件 -->
    <div v-else>
      <HomePage></HomePage>
    </div>
  </div>
</template>

<script>
// 引入路由
import router from './router'
import { ref } from 'vue'

// 引入全局导航栏和页脚组件
import HomePage from './views/HomePage/index.vue'
import StartupInterface from './views/StartupInterface/index.vue'

export default {
  name: 'App',
  components: {
    HomePage,
    StartupInterface
  },
  setup() {
    const IsShow = ref(true)
    const Interface = ref(null)

    const toggle = (data) => {
      IsShow.value = data
    }
    return {
      IsShow,
      Interface,
      toggle
    }
  },
  router // 使用路由
}
</script>

<style>
/* 全局样式 */
#app {
  font-family: Arial, sans-serif;
  /* 这里可以写一些全局的样式 */
}
</style>
